import { Component, ViewEncapsulation } from "@angular/core";
import { ActivatedRoute, UrlSegment, Router } from "@angular/router";
import { BROADCAST_TYPE, BroadcastService, BROADCAST_CLASSIC_PAYLOAD } from "broadcast";

@Component({
  selector: "quote",
  templateUrl: "quote.component.html",
  // encapsulation: ViewEncapsulation.None,
  styleUrls: [
    "quote.component.less"
  ]
})
export class QuoteComponent {
  rightSide = true;
  drawer = true;
  withDrawer = [
    "smse", "gem", "hs", "shanghai", "shenzhen"
  ];
  tabList = [
    {
      text: "A股全景",
      url: "/overview"
    },
    {
      text: "沪深市场",
      url: "/hs"
    },
    {
      text: "上海主板",
      url: "/shanghai"
    },
    {
      text: "深圳主板",
      url: "/shenzhen"
    },
    {
      text: "中小板",
      url: "/smse"
    },
    {
      text: "创业板",
      url: "/gem"
    },
    {
      text: "指数",
      url: "/index"
    },
    {
      text: "板块",
      url: "/block"
    },
    {
      text: "热力地图",
      url: "/treemap"
    }
  ]

  constructor(
    private broadcast: BroadcastService,
    private router: ActivatedRoute
  ) {

  }

  ngOnInit() {
    this.router.url.subscribe((url: UrlSegment[]) => {
      console.debug("Quote Router Params: ", url);
      this.drawer = /smse|gem|hs|shanghai|shenzhen/.test(location.pathname);
    });
  }

  toggleState(state: string) {
    console.debug("BROADCAST toggle: ", state);
    let states = {
      right: BROADCAST_CLASSIC_PAYLOAD.TOGGLE_RIGHT
    }
    this.rightSide = !this.rightSide;
    this.broadcast.broadcast.next({
      type: BROADCAST_TYPE.TOGGLE_STATE,
      payload: states[state]
    });
  }
}